<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
    <th:block th:include="include :: header('营销人员建档拜访情况列表')"/>
</head>
<body class="gray-bg">
<div class="wrapper wrapper-content animated fadeInRight">
    <form class="form-horizontal" id="formIdUserFiling">
        <div class="row">
            <div class="col-sm-12 search-collapse">
                <h3 style="margin-bottom: 5px; color: red; text-align: center">营销人员建档排名</h3>
                <form>
                    <div class="select-list">
                        <ul>
                            <li>
                                <label>机构名称：</label>
                                <input name="deptId" type="hidden" id="treeIdUserFiling"/>
                                <input name="deptName" onclick="selectDeptTreeUserFiling()" id="treeNameUserFiling" type="text"
                                       placeholder="请选择归属机构" autocomplete="off">
                            </li>
                            <li>
                                <a class="btn btn-primary btn-rounded btn-sm" onclick="searchUserFiling()"><i
                                        class="fa fa-search"></i>&nbsp;搜索</a>
                                <a class="btn btn-warning btn-rounded btn-sm" onclick="resetUserFiling()"><i
                                        class="fa fa-refresh"></i>&nbsp;重置</a>
                            </li>
                        </ul>
                    </div>
                </form>
            </div>
            <div class="btn-group-sm" id="toolbarUserFiling" role="group">
                <a class="btn btn-warning" onclick="exportExcelUserFiling()"
                   shiro:hasPermission="merchant:branchFilingVisits:export">
                    <i class="fa fa-download"></i> 导出
                </a>
            </div>
            <div class="col-sm-12 select-table table-striped">
                <table id="bootstrap-table-userFiling"></table>
            </div>
        </div>
    </form>
    <form class="form-horizontal" id="formIdUserVisits">
        <div class="row">
            <div class="col-sm-12 search-collapse">
                <h3 style="margin-bottom: 5px; color: red; text-align: center">营销人员拜访次数排名</h3>
                <form>
                    <div class="select-list">
                        <ul>
                            <li>
                                <label>机构名称：</label>
                                <input name="deptId" type="hidden" id="treeIdUserVisits"/>
                                <input name="deptName" onclick="selectDeptTreeUserVisits()" id="treeNameUserVisits" type="text"
                                       placeholder="请选择归属机构" autocomplete="off">
                            </li>
                            <li>
                                <a class="btn btn-primary btn-rounded btn-sm" onclick="searchUserVisits()"><i
                                        class="fa fa-search"></i>&nbsp;搜索</a>
                                <a class="btn btn-warning btn-rounded btn-sm" onclick="resetUserVisits()"><i
                                        class="fa fa-refresh"></i>&nbsp;重置</a>
                            </li>
                        </ul>
                    </div>
                </form>
            </div>
            <div class="btn-group-sm" id="toolbarUserVisits" role="group">
                <a class="btn btn-warning" onclick="exportExcelUserVisits()"
                   shiro:hasPermission="merchant:branchFilingVisits:export">
                    <i class="fa fa-download"></i> 导出
                </a>
            </div>
            <div class="col-sm-12 select-table table-striped">
                <table id="bootstrap-table-userVisits"></table>
            </div>
        </div>
    </form>
    <form class="form-horizontal" id="formIdUserDoTask">
        <div class="row">
            <div class="col-sm-12 search-collapse">
                <h3 style="margin-bottom: 5px; color: red; text-align: center">营销人员超时拜访次数排名</h3>
                <form>
                    <div class="select-list">
                        <ul>
                            <li>
                                <label>机构名称：</label>
                                <input name="deptId" type="hidden" id="treeIdUserDoTask"/>
                                <input name="deptName" onclick="selectDeptTreeUserDoTask()" id="treeNameUserDoTask" type="text"
                                       placeholder="请选择归属机构" autocomplete="off">
                            </li>
                            <li>
                                <a class="btn btn-primary btn-rounded btn-sm" onclick="searchUserDoTask()"><i
                                        class="fa fa-search"></i>&nbsp;搜索</a>
                                <a class="btn btn-warning btn-rounded btn-sm" onclick="resetUserDoTask()"><i
                                        class="fa fa-refresh"></i>&nbsp;重置</a>
                            </li>
                        </ul>
                    </div>
                </form>
            </div>
            <div class="btn-group-sm" id="toolbarUserDoTask" role="group">
                <a class="btn btn-warning" onclick="exportExcelUserDoTask()"
                   shiro:hasPermission="merchant:branchFilingVisits:export">
                    <i class="fa fa-download"></i> 导出
                </a>
            </div>
            <div class="col-sm-12 select-table table-striped">
                <table id="bootstrap-table-userDoTask"></table>
            </div>
        </div>
    </form>
    <form class="form-horizontal" id="formIdUserUndoTask">
        <div class="row">
            <div class="col-sm-12 search-collapse">
                <h3 style="margin-bottom: 5px; color: red; text-align: center">营销人员超时未拜访次数排名</h3>
                <form>
                    <div class="select-list">
                        <ul>
                            <li>
                                <label>机构名称：</label>
                                <input name="deptId" type="hidden" id="treeIdUserUndoTask"/>
                                <input name="deptName" onclick="selectDeptTreeUserUndoTask()" id="treeNameUserUndoTask" type="text"
                                       placeholder="请选择归属机构" autocomplete="off">
                            </li>
                            <li>
                                <a class="btn btn-primary btn-rounded btn-sm" onclick="searchUserUndoTask()"><i
                                        class="fa fa-search"></i>&nbsp;搜索</a>
                                <a class="btn btn-warning btn-rounded btn-sm" onclick="resetUserUndoTask()"><i
                                        class="fa fa-refresh"></i>&nbsp;重置</a>
                            </li>
                        </ul>
                    </div>
                </form>
            </div>
            <div class="btn-group-sm" id="toolbarUserUndoTask" role="group">
                <a class="btn btn-warning" onclick="exportExcelUserUndoTask()"
                   shiro:hasPermission="merchant:branchFilingVisits:export">
                    <i class="fa fa-download"></i> 导出
                </a>
            </div>
            <div class="col-sm-12 select-table table-striped">
                <table id="bootstrap-table-userUndoTask"></table>
            </div>
        </div>
    </form>
</div>

<th:block th:include="include :: footer"/>
<script type="text/javascript">
    var prefix = ctx + "merchant/ecardChart";

    $(function () {
        /*营销人员建档排名*/
        var userFilingOptions = {
            id: 'bootstrap-table-userFiling',
            toolbar: 'toolbarUserFiling',
            formId: 'formIdUserFiling',
            url: prefix + "/getUserFilingList",
            exportUrl: prefix + "/exportUserFilingList",
            modalName: "营销人员建档排名",
            columns: [
                {
                    field: 'userName',
                    title: '客户经理'
                },
                {
                    field: 'rank',
                    title: '建档排名',
                    align: "center",
                },
                {
                    field: 'merchantNum',
                    title: '商户建档数',
                    sortable: true,
                    formatter: function (value, row, index) {
                        return $.table.formatNumber(value);
                    }
                },
                {
                    field: 'merchantLastMonthNum',
                    title: '上月新增',
                    sortable: true,
                    formatter: function (value, row, index) {
                        return $.table.formatNumber(value);
                    }
                },
                {
                    field: 'merchantThisMonthNum',
                    title: '本月新增',
                    sortable: true,
                    formatter: function (value, row, index) {
                        return $.table.formatNumber(value);
                    }
                },
                {
                    field: 'merchantCompareNum',
                    title: '较上月对比',
                    sortable: true,
                    formatter: function (value, row, index) {
                        return $.table.formatNumber(value);
                    }
                },
                {
                    field: 'deptName',
                    title: '机构名称'
                }]
        };
        $.table.init(userFilingOptions);
        /*营销人员拜访次数排名*/
        var userVisitsOptions = {
            id: 'bootstrap-table-userVisits',
            toolbar: 'toolbarUserVisits',
            formId: 'formIdUserVisits',
            url: prefix + "/getUserVisitsList",
            exportUrl: prefix + "/exportUserVisitsList",
            modalName: "营销人员拜访次数排名",
            columns: [
                {
                    field: 'userName',
                    title: '客户经理'
                },
                {
                    field: 'rank',
                    title: '拜访排名',
                    align: "center",
                },
                {
                    field: 'visitNum',
                    title: '拜访次数',
                    sortable: true,
                    formatter: function (value, row, index) {
                        return $.table.formatNumber(value);
                    }
                },
                {
                    field: 'visitLastMouthNum',
                    title: '上月新增',
                    sortable: true,
                    formatter: function (value, row, index) {
                        return $.table.formatNumber(value);
                    }
                },
                {
                    field: 'visitThisMouthNum',
                    title: '本月新增',
                    sortable: true,
                    formatter: function (value, row, index) {
                        return $.table.formatNumber(value);
                    }
                },
                {
                    field: 'visitCompareNum',
                    title: '较上月对比',
                    sortable: true,
                    formatter: function (value, row, index) {
                        return $.table.formatNumber(value);
                    }
                },
                {
                    field: 'deptName',
                    title: '机构名称'
                }]
        };
        $.table.init(userVisitsOptions);
        /*营销人员超时拜访次数排名*/
        var userDoTaskOptions = {
            id: 'bootstrap-table-userDoTask',
            toolbar: 'toolbarUserDoTask',
            formId: 'formIdUserDoTask',
            url: prefix + "/getUserDoTaskList",
            exportUrl: prefix + "/exportUserDoTaskList",
            modalName: "营销人员超时拜访次数排名",
            columns: [
                {
                    field: 'userName',
                    title: '客户经理'
                },
                {
                    field: 'rank',
                    title: '超时拜访排名',
                    align: "center",
                },
                {
                    field: 'doTaskSum',
                    title: '超时拜访数',
                    sortable: true,
                    formatter: function (value, row, index) {
                        return $.table.formatNumber(value);
                    }
                },
                {
                    field: 'percentageDoTask',
                    title: '超时拜访率',
                    sortable: true,
                    formatter: function (value, row, index) {
                        return $.table.formatNumber(value) + '%';
                    }
                },
                {
                    field: 'rankPercentage',
                    title: '超时拜访率排名',
                    sortable: true,
                    formatter: function (value, row, index) {
                        return $.table.formatNumber(value);
                    }
                },
                {
                    field: 'deptName',
                    title: '机构名称'
                }]
        };
        $.table.init(userDoTaskOptions);
        /*营销人员超时未拜访次数排名*/
        var userUndoTaskOptions = {
            id: 'bootstrap-table-userUndoTask',
            toolbar: 'toolbarUserUndoTask',
            formId: 'formIdUserUndoTask',
            url: prefix + "/getUserUnDoTaskList",
            exportUrl: prefix + "/exportUserUnDoTaskList",
            modalName: "营销人员超时未拜访次数排名",
            columns: [
                {
                    field: 'userName',
                    title: '客户经理'
                },
                {
                    field: 'rank',
                    title: '超时未拜访排名',
                    align: "center",
                },
                {
                    field: 'undoTaskSum',
                    title: '超时未拜访数量',
                    sortable: true,
                    formatter: function (value, row, index) {
                        return $.table.formatNumber(value);
                    }
                },
                {
                    field: 'percentageUndoTask',
                    title: '超时拜访率',
                    sortable: true,
                    formatter: function (value, row, index) {
                        return $.table.formatNumber(value) + '%';
                    }
                },
                {
                    field: 'rankPercentage',
                    title: '超时拜访率排名',
                    sortable: true,
                    formatter: function (value, row, index) {
                        return $.table.formatNumber(value);
                    }
                },
                {
                    field: 'deptName',
                    title: '机构名称'
                }]
        };
        $.table.init(userUndoTaskOptions);
    })

    /*营销人员建档排名相关处理开始*/
    function searchUserFiling() {
        table.set('bootstrap-table-userFiling');
        $.table.search('formIdUserFiling');
    }

    /* 选择机构树 */
    function selectDeptTreeUserFiling() {
        var treeIdUserFiling = $("#treeIdUserFiling").val();
        var deptId = $.common.isEmpty(treeIdUserFiling) ? "100" : $("#treeIdUserFiling").val();
        var url = ctx + "system/dept/selectDeptTree/" + deptId;
        var options = {
            title: '选择部门',
            width: "380",
            url: url,
            callBack: doSubmitUserFiling
        };
        $.modal.openOptions(options);
    }
    function doSubmitUserFiling(index, layero) {
        var body = $.modal.getChildFrame(index);
        $("#treeIdUserFiling").val(body.find('#treeId').val());
        $("#treeNameUserFiling").val(body.find('#treeName').val());
        $.modal.close(index);
    }
    function exportExcelUserFiling() {
        table.set('bootstrap-table-userFiling');
        $.table.exportExcel('formIdUserFiling');
    }
    function resetUserFiling() {
        table.set('bootstrap-table-userFiling');
        $('#treeIdUserFiling').val('')
        $.form.reset('formIdUserFiling');
    }
    /*营销人员建档排名相关处理结束*/

    /*营销人员拜访次数排名相关处理开始*/
    function searchUserVisits() {
        table.set('bootstrap-table-userVisits');
        $.table.search('formIdUserVisits');
    }

    /* 选择机构树 */
    function selectDeptTreeUserVisits() {
        var treeIdUserVisits = $("#treeIdUserVisits").val();
        var deptId = $.common.isEmpty(treeIdUserVisits) ? "100" : $("#treeIdUserVisits").val();
        var url = ctx + "system/dept/selectDeptTree/" + deptId;
        var options = {
            title: '选择部门',
            width: "380",
            url: url,
            callBack: doSubmitUserVisits
        };
        $.modal.openOptions(options);
    }
    function doSubmitUserVisits(index, layero) {
        var body = $.modal.getChildFrame(index);
        $("#treeIdUserVisits").val(body.find('#treeId').val());
        $("#treeNameUserVisits").val(body.find('#treeName').val());
        $.modal.close(index);
    }
    function exportExcelUserVisits() {
        table.set('bootstrap-table-userVisits');
        $.table.exportExcel('formIdUserVisits');
    }
    function resetUserVisits() {
        table.set('bootstrap-table-userVisits');
        $('#treeIdUserVisits').val('')
        $.form.reset('formIdUserVisits');
    }
    /*营销人员拜访次数排名相关处理结束*/

    /*营销人员超时拜访次数排名相关处理开始*/
    function searchUserDoTask() {
        table.set('bootstrap-table-userDoTask');
        $.table.search('formIdUserDoTask');
    }

    /* 选择机构树 */
    function selectDeptTreeUserDoTask() {
        var treeIdUserDoTask = $("#treeIdUserDoTask").val();
        var deptId = $.common.isEmpty(treeIdUserDoTask) ? "100" : $("#treeIdUserDoTask").val();
        var url = ctx + "system/dept/selectDeptTree/" + deptId;
        var options = {
            title: '选择部门',
            width: "380",
            url: url,
            callBack: doSubmitUserDoTask
        };
        $.modal.openOptions(options);
    }
    function doSubmitUserDoTask(index, layero) {
        var body = $.modal.getChildFrame(index);
        $("#treeIdUserDoTask").val(body.find('#treeId').val());
        $("#treeNameUserDoTask").val(body.find('#treeName').val());
        $.modal.close(index);
    }
    function exportExcelUserDoTask() {
        table.set('bootstrap-table-userDoTask');
        $.table.exportExcel('formIdUserDoTask');
    }
    function resetUserDoTask() {
        table.set('bootstrap-table-userDoTask');
        $('#treeIdUserDoTask').val('')
        $.form.reset('formIdUserDoTask');
    }
    /*营销人员超时拜访次数排名相关处理结束*/

    /*营销人员超时拜访次数排名相关处理开始*/
    function searchUserUndoTask() {
        table.set('bootstrap-table-userUndoTask');
        $.table.search('formIdUserUndoTask');
    }

    /* 选择机构树 */
    function selectDeptTreeUserUndoTask() {
        var treeIdUserUndoTask = $("#treeIdUserUndoTask").val();
        var deptId = $.common.isEmpty(treeIdUserUndoTask) ? "100" : $("#treeIdUserUndoTask").val();
        var url = ctx + "system/dept/selectDeptTree/" + deptId;
        var options = {
            title: '选择部门',
            width: "380",
            url: url,
            callBack: doSubmitUserUndoTask
        };
        $.modal.openOptions(options);
    }
    function doSubmitUserUndoTask(index, layero) {
        var body = $.modal.getChildFrame(index);
        $("#treeIdUserUndoTask").val(body.find('#treeId').val());
        $("#treeNameUserUndoTask").val(body.find('#treeName').val());
        $.modal.close(index);
    }
    function exportExcelUserUndoTask() {
        table.set('bootstrap-table-userUndoTask');
        $.table.exportExcel('formIdUserUndoTask');
    }
    function resetUserUndoTask() {
        table.set('bootstrap-table-userUndoTask');
        $('#treeIdUserUndoTask').val('')
        $.form.reset('formIdUserUndoTask');
    }
    /*营销人员超时拜访次数排名相关处理结束*/

</script>
</body>
</html>